
<style>
    .travelers_info thead th {
        background-color: #B2B2B2;
    }
    .relevance thead th{
        background-color:#a3bce4;
    }
</style>

<div class="cl pd-5 bg-1 bk-gray">
        <span class="l">
            <!--{tp:menu menu="add" /}-->
        </span>
        <span class="r pt-5 pr-5">
            共有数据 ：<strong>{$count ?? '0'}</strong> 条
        </span>
</div>
<table class="table table-border table-bordered table-hover table-bg mt-20">
    <thead>
    <tr class="text-c">
        <th width="">+</th>
        <th width="">ID</th>
        <th width="">订单ID</th>
        <th width="">线路名称</th>
        <th width="">预订人</th>
        <th width="">预订人电话</th>
        <th width="">人数</th>
        <th width="">出发日期</th>
        <th width="">平台</th>
        <th width="">用车形式</th>
        <th width="">预订人备注</th>
        <th width="">备注</th>
        <th colspan="2" width="70">操作</th>
    </tr>
    </thead>
    <tbody>
    {volist name="list" id="vo"}
        <tr class="text-c">
            <td>
                <!--{if condition="$vo.show_mian"}-->
                <!--<input class="checkbox_oid checkbox_{$vo.id}" type="checkbox" name="id[]" value="{$vo.id}">-->
                <!--{elseif  condition="$vo.show_single" /}-->
                <input class="checkbox_oid checkbox_{$vo.id}" type="checkbox" name="{$vo.id}" value="{$vo.travelers_info}">
                <!--{/if}-->
            </td>
            <td>{$vo.id}</td>
            <td>{$vo.order_id}</td>
            <td>{$vo.route_title}</td>
            <td>{$vo.booking_people_name}</td>
            <td>{$vo.booking_people_phone}</td>
            <td>{$vo.num}</td>
            <td>{:date('Y-m-d',$vo.start_time)}</td>
            <td class="f-14">
                <?php
                if($platform){
                     foreach($platform as $k=>$v){
                            if($v['platform_name'] == $vo['platform']){
                                $plate = $v['name'];
                            }
                        }
                    }else{
                        $plate = '';
                    }
                ?>
                <?php echo $plate;?>
            </td>
            <td>{$vo.car_form}</td>
            <td>{$vo.booking_people_remark}</td>
            <td>
                <ul>
                    {volist name="$vo.order_remark" id="li" key="key"}
                        <li>{$key}、{$li.content}</li>
                    {/volist}
                </ul>
                <a id="more_remark{$k}" href="javascript:;" onclick="layer_open('备注信息','/admin/order/remark/order_id/{$vo.order_id}')" style="text-decoration:none;"
                   class="label label-success radius" title="更多">更多</a>
            </td>
            <td class="f-14">
                <a title="分配住宿" href="javascript:;" onclick="layer_open('分配住宿','/admin/portion_traveler/deal/oid/{$vo.id}/isdeal/0/isbooking/1.html')" style="text-decoration:none" class="label label-warning radius">分配住宿</a>
                <a title="旅客信息" href="javascript:;" data-val="{$vo.id}" style="text-decoration:none" class="traveller_info label label-warning radius" onclick="show_traveller_info('{$vo.id}')">旅客信息</a>
                <a title="关联订单" href="javascript:;" data-val="{$vo.id}" style="text-decoration:none" class="traveller_info label label-warning radius" onclick="show_relevance_order('{$vo.id}')">关联订单</a>
                <!--<a href="javascript:" class="label label-warning radius" style="text-decoration:none" data-type="form" onclick="deltd(this)" data-header="1">删除</a>-->
            </td>
        </tr>
        <tr id="{$vo.id}" style="display: none">
            <td colspan="14">
                <table id="tab_{$vo.id}" class="table table-border table-bordered table-hover travelers_info">
                    <thead>
                    <tr class="text-c" style="background-color: #EFEFEF;">
                        <th></th>
                        <th>ID</th>
                        <th>姓名</th>
                        <th>电话</th>
                        <th>证件号码</th>
                        <th>居住地址</th>
                        <th>年龄</th>
                        <th>性别</th>
                        <th>包含住宿</th>
                        <th>住宿备注</th>
                        <th>备注</th>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="$vo.travelers_info_list" id="traveler"}
                        <tr class="text-c">
                            <td>-></td>
                            <td><input type="hidden" name="traveler[id][]" value="{$traveler.id}">{$traveler.id}</td>
                            <td>{$traveler.name}</td>
                            <td>{$traveler.phone}</td>
                            <td>{$traveler.id_card}</td>
                            <td>{$traveler.address}</td>
                            <td>{$traveler.age}</td>
                            <td>{$traveler.sex}</td>
                            <td>{$traveler.isaccommodation}</td>
                            <td>{$traveler.accommodation}</td>
                            <td>{$traveler.remark}</td>
                        </tr>
                    {/volist}
                    </tbody>
                </table>
            </td>
        </tr>
        <tr id="relevance_{$vo.id}" style="display: none">
        <td colspan="14">
                <table id="tab_relevance_{$vo.id}" class="table table-border table-bordered table-hover relevance">
                <thead>
                <tr class="text-c">
                    <th width=""></th>
                    <th width="">ID</th>
                    <th width="">订单ID</th>
                    <th width="">线路名称</th>
                    <th width="">预订人</th>
                    <th width="">预订人电话</th>
                    <th width="">人数</th>
                    <th width="">出发日期</th>
                    <th width="">平台</th>
                    <th width="">用车形式</th>
                    <th width="">预订人备注</th>
                    <th width="">备注</th>
                </tr>
                </thead>
                {if empty($vo.relevance_order_list)}
                    <tbody>
                    <tr class="text-c">
                        <td colspan="14" align="center">无关联单信息</td>
                    </tr>
                    </tbody>
                {else/}
                    <tbody>
                    {volist name="$vo.relevance_order_list" id="relevance"}
                    <tr class="text-c">
                        <!--<td>-关联单-></td>-->
                        <td><input class="checkbox_oid relevance_checkbox_{$relevance.id}" type="checkbox" name="{$relevance.id}" value="{$relevance.travelers_info}"></td>
                        <td>{$relevance.id}</td>
                        <td>{$relevance.order_id}</td>
                        <td>{$relevance.route_title}</td>
                        <td>{$relevance.booking_people_name}</td>
                        <td>{$relevance.booking_people_phone}</td>
                        <td>{$relevance.num}</td>
                        <td>{:date('Y-m-d',$relevance.start_time)}</td>
                        <td class="f-14">
                        <?php
                        if($platform){
                            foreach($platform as $k=>$v){
                                    if($relevance['platform_name'] == $relevance['platform']){
                                        $plate = $relevance['name'];
                                    }
                                }
                            }else{
                                $plate = '';
                            }
                        ?>
                        <?php echo $plate;?>
                        </td>
                        <td>{$relevance.car_form}</td>
                        <td>{$relevance.booking_people_remark}</td>
                        <td>
                            <ul>
                                {volist name="$relevance.order_remark" id="li" key="key"}
                                <li>{$key}、{$li.content}</li>
                                {/volist}
                            </ul>
                            <a id="relevance_more_remark{$k}" href="javascript:;" onclick="layer_open('备注信息','/admin/order/remark/order_id/{$relevance.order_id}')" style="text-decoration:none;"
                               class="label label-success radius" title="更多">更多</a>
                        </td>
                    </tr>
                    {/volist}
                    </tbody>
                {/if}
            </table>
        </td>
    </tr>
    {/volist}
    </tbody>
</table>

<div class="page-bootstrap">{$page ?? ''}</div>

{if condition="$refresh eq 1"}
<script>
    $(function () {
//            $(".traveller_info").click(function(e) {
//                var id = $(".traveller_info").attr('data-val');
//                $("#"+id+"").toggle();
//                console.log(id)
//            });
        $(".listBox").on("click",".driver",null,function (event) {

            event.stopPropagation();  //只阻止了冒泡事件， 默认默认行为没有阻止
            var has_class=$(this).parent().hasClass('selected_box');
            $(".list").removeClass("selected_box");
            $(this).parent().addClass('selected_box');


            //获取点击的订单id
            var order_id = $(this).next()[0]['attributes']['data-traveler_oid'].nodeValue
            //获取所有司机user_id
            var driver_user_ids = new Array();
            $(".box").find(".driver").each(function () {
                driver_user_id = $(this).data('user_id');
                driver_user_ids.push(driver_user_id);
            })
            var driver_user_ids_str = 0;
            if(driver_user_ids){
                driver_user_ids_str = driver_user_ids.join(',');
            }
            console.log('你进入到司机列表')
//                 console.log('order_id',order_id)
//                 console.log('driver_user_ids',driver_user_ids)
            //打开司机列表页面
            var index = layer.open({
                type: 2,
                area: ['80%', '75%'],
                fixed: false, //不固定
                maxmin: true,
                content: '/admin/order_traveler/driver/driver_user_id/'+driver_user_ids_str+'/order_id/'+ order_id //增加订单id
            });
        })
        $("body").on("click",".listBox",null,function () {
            $(".list").removeClass("selected_box");
        })
        $(".listBox").on("click",".delete",null,function () {
            //获取所有oid
            var oids=new Array();
            $(this).parent().find(".traveler").each(function () {
                var this_oid=$(this).data('traveler_oid');
                oids[this_oid]=this_oid;
            })
            //还原选择按钮状态
            for (oid in oids)
            {
                $(".checkbox_"+oid).removeAttr("checked");
            }
            $(this).parent().remove();
        })

        $(".listBox").on("click",".list",null,function (event) {
            console.log('你点击了阻止冒泡时间');
            event.stopPropagation();  //只阻止了冒泡事件， 默认默认行为没有阻止
            var has_class=$(this).hasClass('selected_box');
            $(".list").removeClass("selected_box");
            if(!has_class){
                $(this).addClass('selected_box');
            }
        })

        $(".checkbox_oid").click(function () {
            console.log('123')
            var selected_box = $(".selected_box");//length
            if(selected_box.length > 0){
                selected_box = selected_box.eq(0);
            }else{
                selected_box = null;
            }
            var list = $(this).val()
            var oid = $(this).prop('name')
            var arr = list.split(',')
            console.log('len',arr)
            var traveler_ids = new Array
            var traveler_names = new Array
            for(var i = 0;i<arr.length;i++){
                var temp = arr[i].split('-')
                traveler_ids[i] = temp[0]
                traveler_names[i] = temp[1]
            }
            console.log('traveler_ids',traveler_ids)
            console.log('traveler_names',traveler_names)
            var checked=$(this).is(":checked");//选中，返回true;没选中，返回false;
//            var checked_name = 'relevance_checkbox_'+oid
//            var checked2 = $("#"+checked_name+"").is(":checked")
//            console.log('checked2', checked2);
            // console.log('你选中的订单id是', oid);
            if(checked){
                if(selected_box){
                    $(traveler_ids).each(function (index,e) {
                        var traveler_id = traveler_ids[index];
                        var traveler_name = traveler_names[index];
                        $(selected_box).append('<span class="traveler traveler_id_'+traveler_id+' traveler_oid_'+oid+'" data-traveler_id="'+traveler_id+'" data-traveler_oid="'+oid+'">'+traveler_name+'</span>');
                    })

                }else{
                    $('.listBox').append('<div class="list selected_box"><div class="delete">×</div><p class="driver driver_0" data-user_id="0">选择司机</p></div>');
                    selected_box=$(".selected_box").eq(0);
                    $(traveler_ids).each(function (index,e) {
                        var traveler_id = traveler_ids[index];
                        var traveler_name = traveler_names[index];
                        $(selected_box).append('<span class="traveler traveler_id_'+traveler_id+' traveler_oid_'+oid+'" data-traveler_id="'+traveler_id+'" data-traveler_oid="'+oid+'">'+traveler_name+'</span>');
                    })
                }
            }else{
                $(".traveler_oid_"+oid).remove();
            }
        });
        $("#submit").click(function () {
            var groups=[];
            $(".list").each(function () {
                var group = get_group(this);
                if(!group.driver_user_id){
                    layer.msg("请分配好司机，不能为空");
                }
                if(!group.traveler_id.length){
                    layer.msg("请分配好旅客，不能为空");
                }
                groups.push(group);
            });
            $.ajax({
                type : "POST", //提交方式
                url : "/admin/order_traveler/add_group",//路径
                data : {
                    "groups" : groups
                },//数据，这里使用的是Json格式进行传输
                //返回数据根据结果进行相应的处理
                success : function(result){
                    layer.msg(result.msg,{
                        time: 5000, //5s后自动关闭
                        btn: [ '刷新']
                    },function () {
                        location.reload()
                    });
                }
            });
        });
        function get_group(list) {
            var driver = $(list).find('.driver').data();
            var travelers = new Array();
            var traveler_doms = $(list).find('.traveler');
            $(traveler_doms).each(function () {
                var traveler_id = $(this).data('traveler_id');
                travelers.push(traveler_id);
            })
            console.log('travelers',travelers);
            var group = {driver_user_id:driver.user_id,traveler_id:travelers};
            console.log('group',group);
            return group;
        }
    })
</script>
{/if}